<template>
	<view>
		<z-paging ref="paging" v-model="list" @query="getPage" :auto="false">
			<cu-custom slot="top" :isBack="true" :bgColor="'bg-'+ theme.themeColor">
				<block slot="backText">返回</block>
				<block slot="content">退款/售后</block>
			</cu-custom>
			<view class="bg-white margin-xs padding-sm radius" v-for="(item,index) in list" :key="index">
				<view class="flex">
					<view class="basis-xs margin-xs">
						<view v-if="item.orderItem.picUrl" class="cu-avatar xl"
							:style="'background-image:url(' + item.orderItem.picUrl + ')'">
						</view>
					</view>
					<view class="basis-xl margin-xs">
						<view>
							{{item.orderItem.spuName}}
						</view>
						<view v-if="item.orderItem.specsInfo" class="text-gray">
							{{item.orderItem.specsInfo}}
						</view>
						<view class="margin-tb-xs">
							退款金额：
							<text class="text-bold text-df text-price" :class="'text-'+ theme.themeColor">
								{{item.refundAmount}}
							</text>
						</view>
					</view>
				</view>
				<view class="bg-gray padding margin-xs radius" v-if="item.status == '1' || item.status == '2'">
					退款正在申请中
				</view>
				<view class="bg-gray padding margin-xs radius" v-if="item.status == '11' || item.status == '12'">
					<text v-if="item.arrivalStatus == '1'">退款成功</text>
					<text v-if="item.userReceivedAccount" class="padding-lr-sm">退回{{item.userReceivedAccount}}</text>
				</view>
				<view class="bg-gray padding margin-xs radius" v-if="item.status == '21' || item.status == '22'">
					<text>商家拒绝退款</text>
					<text v-if="item.refuseReason" class="padding-lr-sm">{{item.refuseReason}}</text>
				</view>

				<view class="flex justify-end padding-xs">
					<navigator class="cu-btn round" :class="'text-'+theme.themeColor" hover-class="none"
						:url="'/pages/order/order-refund/refund-detail/index?id=' + item.id">
						查看详情
					</navigator>
				</view>
			</view>
		</z-paging>
	</view>
</template>

<script>
	import {
		getPage
	} from '@/api/orderrefund.js';
	export default {
		data() {
			return {
				theme: getApp().globalData.theme,
				list: []
			}
		},
		onLoad(option) {
			getApp().initPage().then(res => {
				this.$nextTick(function() {
					this.$refs.paging.reload();
				})
			})
		},
		methods: {
			/**
			 * 分页查询
			 */
			getPage(pageNo, pageSize) {
				getPage({
					current: pageNo,
					size: pageSize,
					descs: 'create_time',
				}).then(res => {
					this.$refs.paging.complete(res.data.records);
				});
			},

		}
	}
</script>

<style>
</style>
